<!DOCTYPE HTML>
<html>
  <head>
    <title>US MAP</title>
   <style type="text/css">
   #dbg  
   {
     font-family: Arial,Helvetica,Sans-serif;
     border: 1px solid black;
     width: 600;
     clear:both;
     float:left;
   }
   body 
   {
     background:#000;
     color:white;
     font-family: Arial,Helvetica,Sans-serif;
   }
   a 
   {
       color: #009de9;
       outline: none;
   } 
   a:hover 
   {
       text-decoration: none;
   }
  </style>
  <script type="text/javascript" src="jquery.min.js"></script>
  <script type="text/javascript" src="twitStream.js"></script>


    <script type="text/javascript">
      showTweetLinks='all';
    </script>
    <link rel="stylesheet" href="twit-stream.css" />

    <script type="text/javascript" src="MapConfig.js"> </script>
    <script type="text/javascript" src="Map.js">   </script>
	
	<script src="piechart.js"></script>
	

    <style type="text/css">
      canvas { border: 1px solid black; }
    </style>
  </head>


  <body onload="map_main();" >
  <div style="font-size:20px"><center>U.S. Electoral Map</center></div>

<select>
  <option value="electorial">Electorial Votes</option>
  <option value="election">2012 Election</option>
  <option value="google">Google Trends</option>
  <option value="twitter">Twitter Activity</option>
</select>

  <div style="width:800px;float:left;">

  <canvas id="map_canvas" width="800" height="480" style="position:relative;">
      
  </canvas>

  </div>
  
  <div>
  <canvas id="piechart" width="400" height="400">
  </canvas>
  </div>



<br clear="all">
  <div style="background:grey"> Electoral Votes 
    <div id="map_key"></div>
  </div>

  <br>
  <p>Five most recent tweets mentioning <a target="_blank" href="http://search.twitter.com/search?q=%23obama+OR+romney">obama OR romney</a>:</p>
  <div class="twitStream 5" id="tweets" title="obama+OR+romney"></div>

  </body>
</html>